// const { resolve } = require("path");

// /* config-overrides.js */
// module.exports = function override(config, env) {
//   //do stuff with the webpack config...
//   // config 就是 webpack 的配置
//   // env 是当前环境
//   console.log("config", config);
//   console.log("env", env);

//   // PS: 对 config 做自定义的配置
//   //    1. 处理 alias
//   config.resolve.alias["@"] = resolve(__dirname, "./src");

//   return config;
// };

// 上面的配置需要我们自行的去修改 config 内容，比较麻烦，有没有直接通过调用方法的方式
//    再安装一款 customize-cra 该模块给我们提供了很多的方法，方法内部去修改 webpack config

const { override, addWebpackAlias } = require("customize-cra");
const path = require("path");

const addPostcssPlugins = (plugins) => (config) => {
  const rules = config.module.rules.find((rule) =>
    Array.isArray(rule.oneOf)
  ).oneOf;
  rules.forEach(
    (r) =>
      r.use &&
      r.use.forEach((u) => {
        if (
          u.options &&
          u.options.postcssOptions &&
          u.options.postcssOptions.ident === "postcss"
        ) {
          if (!u.options.postcssOptions.plugins) {
            u.options.postcssOptions.plugins = () => [...plugins];
          }
          if (u.options.postcssOptions.plugins) {
            const originalPlugins = u.options.postcssOptions.plugins;
            u.options.postcssOptions.plugins = () => [
              ...originalPlugins(),
              ...plugins,
            ];
          }
        }
      })
  );
  return config;
};

module.exports = override(
  // add an alias for "ag-grid-react" imports
  addWebpackAlias({
    "@": path.resolve(__dirname, "./src"),
  }),

  addPostcssPlugins([
    require("postcss-pxtorem")({ rootValue: 37.5, propList: ["*"] }),
  ])
);
